import React, {Component} from 'react';
import {Button, Card, Form, Input, message, Space, Table, Tag} from "antd";
import {request, history} from "umi";
import {getUserInfo, ShowError} from "@/utils/format";
import {nanoid, PageContainer} from "@ant-design/pro-components";
import {FillApi} from "@/services/School/SchoolApi";
import {ServerMessages} from "@/services/ServerMessages";


class Index extends Component {
  state = {
    dataSource: [],
    originDataSource: [],
    colums: [
      // {
      //   title: '学科代码', // 列头显示文字
      //   dataIndex: 'discipline_code', // 列数据在数据项中对应的路径
      //   align: 'center'
      // },
      {
        title: '学科', // 列头显示文字
        dataIndex: 'discipline_name', // 列数据在数据项中对应的路径
        align: 'center',
        render: (text: string) => <b>{text}</b>
      },
      {
        title: '进度', // 列头显示文字
        dataIndex: 'percentage', // 列数据在数据项中对应的路径
        align: 'center',
        render: (text, data, idx) => {
          return <>
            {data["percentage"] === "100%" && <Tag color="green">已填报</Tag>}
            {(data["percentage"] && (data["percentage"] !== "100%") && (data["percentage"] !== "0%")) && <Tag color="blue">填报中 {data["percentage"]}</Tag>}
            {data["percentage"] === "0%" && <Tag>未填报</Tag>}
          </>
        },
      },
      {
        title: '操作',
        dataIndex: 'discipline_name',
        align: 'center',
        render: (text: string, data) => {
          if (data.is_subject_group === 1) {
            return <Button onClick={(e) => {
              console.log("@跳转: /check_all_discipline/items?code="+text)
              history.push('/check_all_discipline/group')
            }
            } type="primary">审核</Button>
          }
          return <Button onClick={(e) => {
            console.log("@跳转: /check_all_discipline/items?code="+text)
            history.push('/check_all_discipline/items?name='+text)
          }
          } type="primary">审核</Button>
        }
      }
    ],
    loading: true
  }

  componentDidMount() {
    const userInfo = getUserInfo()
    const dataSource = []
    // request('http://192.168.31.34:3007/api/index/school-query/query-all-discipline', {
    //   method: 'POST',
    //   headers: {
    //     'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8',
    //     'Authorization': userInfo.token,
    //   },
    // }).then(res => {
    //   if (res.status === 0) {
    //     for (let i = 0; i < res.data.length; i++) {
    //       dataSource.push({...res.data[i]})
    //     }
    //     console.log(dataSource)
    //     this.setState({loading: false, dataSource: dataSource})
    //   } else {
    //     this.setState({loading: false})
    //   }
    // })

    const name = history.location.query.name
    if (!name) {
      ShowError("参数错误")
      history.goBack()
      return
    }
    FillApi('/api/index/school-query/query-ncu-all-discipline', {tag: name}, (response) => {
          for (let i = 0; i < response.data.length; i++) {
            dataSource.push({...response.data[i], key: nanoid()})
          }
          this.setState({loading: false, dataSource: dataSource})
    }, (response) => {
      ShowError(response.message)
      this.setState({loading: false})
    }, () => {
      ShowError(ServerMessages.error_message)
      this.setState({loading: false})
    })

    // console.log(res)
    // if (res.status === 0) {
    //   this.setState({loading: false})
    // } else {
    //   this.setState({loading: false})
    // }
  }

  render() {
    return (
      <PageContainer title={history.location.query.name}>
        <Space direction="vertical" size="middle" style={{display: 'flex'}}>
          <Card>
            <Form
              name="basic"
              layout="inline"
              labelCol={{ span: 8 }}
              wrapperCol={{ span: 16 }}
              initialValues={{ remember: true }}
              onFinish={(values) => {
                if (this.state.originDataSource.length === 0) {
                  this.state.originDataSource = this.state.dataSource
                }
                console.log(this.state.originDataSource.length)
                this.state.dataSource = this.state.originDataSource.filter((current) => {
                  return current.discipline_name.indexOf(values.keyword) !== -1 || current.discipline_code === values.keyword
                })
                this.setState({dataSource: this.state.dataSource})
              }}
              // onFinishFailed={onFinishFailed}
              autoComplete="off"
            >
              <Form.Item
                label="请输入关键字"
                name="keyword"
              >
                <Input placeholder="请输入关键字"/>
              </Form.Item>
              <Form.Item>
                <Button
                  type="primary"
                  htmlType="submit"
                >
                  搜索
                </Button>
              </Form.Item>
              <Form.Item>
                <Button
                  type="default"
                  onClick={() => {
                    if (this.state.originDataSource.length !== 0) {
                      this.state.dataSource = this.state.originDataSource
                    }
                    this.setState({dataSource: this.state.dataSource})
                  }}
                >
                  全部
                </Button>
              </Form.Item>
            </Form>
          </Card>
          <Card bordered={false}>
            <Table
              loading={this.state.loading}
              columns={this.state.colums}
              dataSource={this.state.dataSource}
              pagination={{
                pageSize: 20
              }}
            />
          </Card>
        </Space>
      </PageContainer>
    );
  }
}

export default Index;
